<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<title>Flotr: Basic Bubbles Example</title>
		<link rel="stylesheet" href="style.css" type="text/css" />
		<script type="text/javascript" src="../lib/yepnope.js"></script>
	</head>
	<body>
		
		<!-- ad -->
		
		<div id="wrapper">
			<h1></h1>
			<div id="container" style="width:600px;height:300px;"></div>
			<h2>Example</h2>
			<p>Random bubble graph.</p>
			<p>Finished? Go to the example <a href="index.html" title="Flotr Example Index Page">index page</a>, play with the <a href="../../playground/index.html" title="Flotr playground">playground</a> or read the <a href="http://www.solutoire.com/flotr/docs/" title="Flotr Documentation Pages">Flotr Documentation Pages</a>.</p>
			<h2>The Code</h2>
			<pre id="code-view"><code class="javascript"></code></pre>
			<div id="footer">Copyright &copy; 2008 Bas Wenneker, <a href="http://www.solutoire.com">solutoire.com</a></div>
		</div>
		
		<!-- ad -->
		
		<script type="text/javascript">
			function example(){

                var container = document.getElementById('container');

				/**
				 * Fill series d1 and d2 width random values.
				 */
				var point, 
            d1 = [], d2 = [];
            
			  for(var i = 0; i < 10; i++ ){
          point = [i, Math.ceil(Math.random()*10), Math.ceil(Math.random()*10)];
					d1.push(point);
          
          point = [i, Math.ceil(Math.random()*10), Math.ceil(Math.random()*10)];
					d2.push(point);
				}
				
				/**
				 * Draw the graph in the first container.
				 */
				Flotr.draw(container,
                    [d1, d2],
					{
            bubbles: {show:true, baseRadius: 5},
            xaxis: {min: -4, max: 14},
            yaxis: {min: -4, max: 14}
					}
				);
			};			
		</script>
		
		<!-- analytics -->
		
	</body>
	<script type="text/javascript" src="includes.js"></script>
</html>
